<div class="record-box">
    {if condition="!$records"}
        <p style="color: black;font-size: 1em">暂无分享记录</p>
    {/if}
    {volist name="records" id="record"}
    <div class="record-list">
        <img class="record-img" src="{$record['piece']['img_url']}"/>
        {if condition="!$record.is_received"}
        <span>
            未被领取
        </span>
        <button class="min-button share" data-img="{$record['piece']['img_url']}" data-piece-id="{$record['piece_id']}" data-product-id="{$record['product_id']}" data-share-id="{$record['id']}">继续分享</button>
        {else/}
        <span>
            {$record['receiver_nickname']}
        </span>
        <span style="margin-right: 0.5em">
            {$record['receive_time']|date='m-d H:m',###} 已领取
        </span>
        {/if}
    </div>
    {/volist}
</div>
<style>
    .record-box{
        max-height: 30em;
        min-width: 80vw;
    }
    .record-list{
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: inherit;
        height: 5em;
        border-bottom: dashed 1px white;
    }
    .record-img{
        width: 3em;
        height: 3em;
        border-radius: 0.2em;
    }
</style>
<script>
    $('.share').click(function () {
        var product_id = $(this).data('product-id');
        var share_id = $(this).data('share-id');
        var piece_id = $(this).data('piece-id');
        var img_url = '{$share_info.use_main_img}'?$(this).data('img'):'{$share_info.img_url}';
        sharePieceToFriend('{$share_info.title}','{$share_info.desc}',img_url,share_id,piece_id,product_id,function (data) {

        });
        sharePieceToTimeLine('{$share_info.title}',img_url,share_id,piece_id,product_id,function (data) {

        });
    })
</script>